import type { Directive, DirectiveBinding } from "vue";
interface ElType extends HTMLElement {
  __handleClick__: () => any;
}
// 防抖指令
const debounce: Directive = {
  mounted(el: ElType, binding: DirectiveBinding) {
    console.log('debounce',binding);
    if (typeof binding.value !== "function") return;

    let timer: NodeJS.Timeout | null = null;
    el.__handleClick__ = function () {
      if (timer) clearInterval(timer);

      timer = setTimeout(() => {
        binding.value();
      }, 500);
    };
    el.addEventListener("click", el.__handleClick__);
  },
  beforeUnmount(el: ElType) {
    el.removeEventListener("click", el.__handleClick__);
  },
};
export default debounce;
